<!DOCTYPE html>
<html ng-app="ionicApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>{$title}</title>
    <link href="../addons/meepo_bbs/template/mobile/default/static/css/ionic.css" rel="stylesheet">
    <link href="../addons/meepo_bbs/template/mobile/default/static/css/ionic.contrib.frostedGlass.css" rel="stylesheet">
    <script src="{$_W['siteroot']}app/resource/js/require.js"></script>
	<script src="{$_W['siteroot']}app/resource/js/app/config.js"></script>
    <script src="../addons/meepo_bbs/template/mobile/default/static/js/ionic.bundle.js"></script>
    <script src="../addons/meepo_bbs/template/mobile/default/static/js/ionic.contrib.frostedGlass.js"></script>
    <script src="../addons/meepo_bbs/template/mobile/default/static/lib/moment/moment.js"></script>
	<script src="../addons/meepo_bbs/template/mobile/default/static/lib/moment/lang/zh-cn.js"></script>
		<script type="text/javascript">
	if(navigator.appName == 'Microsoft Internet Explorer'){
		if(navigator.userAgent.indexOf("MSIE 5.0")>0 || navigator.userAgent.indexOf("MSIE 6.0")>0 || navigator.userAgent.indexOf("MSIE 7.0")>0) {
			alert('您使用的 IE 浏览器版本过低, 推荐使用 Chrome 浏览器或 IE8 及以上版本浏览器.');
		}
	}
	{php define('HEADER', true);}
	window.sysinfo = {
{if !empty($_W['uniacid'])}
		'uniacid': '{$_W['uniacid']}',
{/if}
{if !empty($_W['acid'])}
		'acid': '{$_W['acid']}',
{/if}
{if !empty($_W['openid'])}
		'openid': '{$_W['openid']}',
{/if}
{if !empty($_W['uid'])}
		'uid': '{$_W['uid']}',
{/if}
		'siteroot': '{$_W['siteroot']}',
		'siteurl': '{$_W['siteurl']}',
		'attachurl': '{$_W['attachurl']}',
{if defined('MODULE_URL')}
		'MODULE_URL': '{MODULE_URL}',
{/if}
		'cookie' : {'pre': '{$_W['config']['cookie']['pre']}'}
	};
	
	// jssdk config 对象
	jssdkconfig = {php echo json_encode($_W['account']['jssdkconfig']);} || {};
	
	// 是否启用调试
	jssdkconfig.debug = false;
	
	jssdkconfig.jsApiList = [
		'checkJsApi',
		'onMenuShareTimeline',
		'onMenuShareAppMessage',
		'onMenuShareQQ',
		'onMenuShareWeibo',
		'hideMenuItems',
		'showMenuItems',
		'hideAllNonBaseMenuItem',
		'showAllNonBaseMenuItem',
		'translateVoice',
		'startRecord',
		'stopRecord',
		'onRecordEnd',
		'playVoice',
		'pauseVoice',
		'stopVoice',
		'uploadVoice',
		'downloadVoice',
		'chooseImage',
		'previewImage',
		'uploadImage',
		'downloadImage',
		'getNetworkType',
		'openLocation',
		'getLocation',
		'hideOptionMenu',
		'showOptionMenu',
		'closeWindow',
		'scanQRCode',
		'chooseWXPay',
		'openProductSpecificView',
		'addCard',
		'chooseCard',
		'openCard'
	];
	
	</script>
  </head>
<body ng-controller="MyCtrl">
<ion-header-bar align-title="center" class="bar-stable">
  <h1 class="title" ng-bind="title"></h1>
</ion-header-bar>
<style>
.bar.bar-stable {
  border-color: #b2b2b2;
  background-color: #FFFFFF;
  background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%);
  color: #000;
}

.tabs-stable > .tabs, .tabs.tabs-stable {
  border-color: #FFFFFF;
  background-color: #FFFFFF;
  background-image: linear-gradient(0deg, #FFFFFF, #FDFDF4 50%, transparent 50%);
  color: #000;
}

a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}

.item p{
	white-space: normal;
  width: 90%;
}
</style>

<style>
.bar.bar-stable {
  border-color: #b2b2b2;
  background-color: #FFFFFF;
  background-image: linear-gradient(0deg, #b2b2b2, #b2b2b2 50%, transparent 50%);
  color: #000;
}

.tabs-stable > .tabs, .tabs.tabs-stable {
  border-color: #FFFFFF;
  background-color: #FFFFFF;
  background-image: linear-gradient(0deg, #FFFFFF, #FDFDF4 50%, transparent 50%);
  color: #000;
}

a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}

.money-head{
	background-color: rgb(131, 234, 88);
	margin: 0;
	padding: 0;
}

.money-head img{
  margin-top: 1em;
  margin-left: 1em;
  width: 4em;
  height: 4em;
  border-radius: 2em;
  box-shadow: 0 0 1px #D7D7D7;
}

.money-header{
	display: inline-block;
}
.money-body{
	display: inline-block;
  float: right;
  margin-top: 1em;
  color: white;
}


.money-body .title{
	display:block;
	margin-right: 1em;
}
.money-body span p{
	  color: white;
}

.money-footer {
  display: block;
  margin-top: 0.6em;
  height: 2.2em;
  padding-top: 0.5em;
  background-color: rgb(80, 145, 53);
  padding-left: 1em;
  opacity: 0.9;
}

.money-footer span{color: white;}
.money-footer .content{  float: right;
  margin-right: 1em;}

</style>
<ion-content class="has-header"  style="background-color: rgb(240, 240, 240);">


{if $task}

{if $_GET['view']=='member'}
	<div class="list">
		<div class="item-divider">完成该任务的用户列表</div>
		
		{loop $list $li}
			<div class="item item-avatar">
				<img src="{php echo tomedia($li['avatar'])}"/>
				<h2>{$li['nickname']}</h2>
				<p>完成时间{php echo date('Y-m-d',$li['dateline'])}</p>
			</div>
		{/loop}
	</div>
{else}

<div class="list">
	<a href="{{item.url}}" class="item money-head">
	  	<div class="money-header">
	  		<img src="{php echo tomedia($task[image])}"/>
	  	</div>
	    
	    <div class="money-body">
	    	<span class="title">有奖任务：{$task[name]}</span>
	    	<span class="content">
					<!--{if $task[starttime]}--><p>开始时间：<!--{php echo date('Y-m-d',$task[starttime])}--></p><!--{/if}-->
					<!--{if $task[endtime]}--><p>结束时间：<!--{php echo date('Y-m-d',$task[endtime])}--></p><!--{/if}-->
	    	</span>
	    </div>
  		<!--{if $task[credit]}-->
  		<div class="money-footer">
  			<span class="title">奖励积分:</span>
	    	<span class="content">{$task[credit]}</span>
  		</div>
  		{/if}
	 </a>
				
	<div style="padding-top:20px;">
	{if $task['done']}
		{if $task['ignore']}
			<li class="item">
				<caption>
					<h2>任务被放弃</h2>
					<p>您已经放弃参与该任务，没有获得任何奖励。</p>
				</caption>
				<tr>
					<td><a href="{php echo $this->createMobileUrl('task',array('taskid'=>$task['taskid'],'op'=>'redo'))}" class="submit">重新参与</a></td>
				</tr>
			</li>
		{elseif $_W['task_maxnum']}
			<li class="item">
				<caption>
					<h2>参与名额已满</h2>
					<p>该有奖任务目前已经达到名额上限了。</p>
				</caption>
				<tr>
					<td><a href="{php echo $this->createMobileUrl('task')}" class="submit">看看其他任务</a></td>
				</tr>
			</li>
			
		{elseif $_W['task_available']}
			<li class="item">
				<caption>
					<h2>任务失效</h2>
					<p>该有奖任务目前已经停止了。</p>
				</caption>
				<tr>
					<td><a href="{php echo $this->createMobileUrl('task')}" class="submit">看看其他任务</a></td>
				</tr>
			</li>
		{else}
			<li class="item">
				<caption>
					<h2>成功完成任务</h2>
					<p>恭喜，您已经领取到任务奖励！</p>
				</caption>
				<tr>
					<td>
					<!--{if $task[credit]}--><p style="color:red;font-size:14px;padding:0 0 5px 0;font-weight:bold;">奖励积分{$task[credit]}个，您现在已经有 {$space[credit1]} 个积分啦！</p><!--{/if}-->
					<p>完成时间：<!--{php echo date('Y-m-d H:i',$task[dateline])}--></p>
					<p>参与人次：<a href="{php echo $this->createMobileUrl('task',array('taskid'=>$task['taskid'],'view'=>'member'))}">{$task[num]} 人</a></p>
					</td>
				</tr>
			</li>
			{if $task[result]}
			<li class="item">
				<caption>
					<h2>任务额外奖励</h2>
				</caption>
				<tr>
					<td>{$task[result]}</td>
				</tr>
			</li>
			{/if}
		{/if}
	{else}
			
			<li class="item">
				<caption>
					<h2>参与任务的步骤说明</h2>
					<p>请您仔细阅读下面的参与本任务的步骤说明，按照指示来完成操作并领取任务奖励。</p>
				</caption>
				{$task[guide]}
			</li><br>
			
			{if $_GET['view']=='result'}
			<li class="item">
			<p>提示：请先按照上面的步骤说明完成任务后再点击领取奖励链接。</p>
			</li>
			
			{/if}
				
			<div class="list">
				<a href="{php echo $this->createMobileUrl('task',array('taskid'=>$task['taskid'],'op'=>'result'))}" class="item item-icon-left item-icon-right">
				<i class="icon ion-ios-navigate-outline"></i>
				领取奖励
				<i class="icon ion-ios-arrow-right"></i>
				</a>
				<a href="{php echo $this->createMobileUrl('task',array('taskid'=>$task['taskid'],'op'=>'ignore'))}" class="item item-icon-left item-icon-right">
				<i class="icon ion-ios-close-empty"></i>
				暂时放弃
				<i class="icon ion-ios-arrow-right"></i>
				</a>
			</div>
			
	{/if}
	</div>
	
</div>

<div id="card">
	<div class="item">
		<h2 class="title">
			<a href="{php echo $this->createMobileUrl('task',array('taskid'=>$task['taskid'],'view'=>'member'))}" class="r_option">查看全部</a>
			刚刚完成该任务的朋友
		</h2>
		<ul class="avatar_list">
			<!--{loop $taskspacelist $key $value}-->
			<li class="item item-avatar">
				<img src="{php echo tomedia($value['avatar'])}"/>
				<h2>任务：{$value['taskname']}</h2>
				<p>完成时间：<!--{php echo date('Y年m月d日',$value[dateline])}--></p>
			</li>
			<!--{/loop}-->
		</ul>
	</div>
</div>

{/if}

{else}
<style>
.percent{
	background-color:rgb(42, 144, 8);
}
</style>
<div class="content">
	<div class="list">
		<div class="item" style="widht:90%;white-space:normal;">按任务优先级排序，参与任务有大奖，开始吧。</div>
		
		{if $_GET['view'] != 'done'}
		<div class="item item-divider">
		    <div class="percent" style="width: {$done_per}%;">&nbsp;</div>
			我当前的任务完成度 {$done_per}%
		</div>
		{/if}
	
	
		
	{if empty($tasklist)}
		<li class="item">没有相关数据。</li>
	{else}
		
		{loop $tasklist $value}
			<li class="item item-thumbnail-left ">
				<img src="{php echo tomedia($value[image])}"/>
				<h2 class="title">{$value[name]}</h2>
				<!--{if $value[num]}-->
					<p>
						<a href="{php echo $this->createMobileUrl('task',array('taskid'=>$value['taskid'],'view'=>'member'))}">已参与人次： {$value[num]}</a>
						<!--{if $value[maxnum]}-->
						/ 本任务还可参与 <!--{php echo $value[maxnum]-$value[num];}--> 人次
						<!--{/if}-->
					</p>
				<!--{/if}-->
				<!--{if $value[starttime]}--><p>开始时间：<!--{php echo date('Y-m-d',$value[starttime])}--></p><!--{/if}-->
				<!--{if $value[endtime]}--><p>结束时间：<!--{php echo date('Y-m-d',$value[endtime])}--></p><!--{/if}-->
				<p>{$value[note]}</p>
				
				<!--{if $value['done']}-->
					<!--{if $value['ignore']}-->
						已经放弃该任务<br>
						您可以选择<a class="button" href="{php echo $this->createMobileUrl('task',array('taskid'=>$value['taskid'],'op'=>'redo'))}">重新完成该任务</a>
					<!--{else}-->
						<!--{if $value[credit]}--><p>获得积分：<strong class="num">{$value[credit]}</strong></p><!--{/if}-->
					<!--{/if}-->
				<!--{else}-->
					<!--{if $value[credit]}--><p>可获得积分：<strong class="num">{$value[credit]}</strong></p><!--{/if}-->
				<!--{/if}-->
			</li>
			
			<div class="item tabs tabs-secondary tabs-icon-left">
		    <a class="tab-item" href="{php echo $this->createMobileUrl('task',array('taskid'=>$value['taskid'],'op'=>'do'))}">
		      <i class="icon ion-thumbsup"></i>
		      立即参与
		    </a>
		    <a class="tab-item" href="{php echo $this->createMobileUrl('task',array('taskid'=>$value['taskid']))}">
		      <i class="icon ion-chatbox"></i>
		     查看任务
		    </a>
		  </div>
		{/loop}
		
	{/if}
	</div>
	<div class="item item-divider">
		<h2 class="title">
			刚刚完成任务的朋友
		</h2>
	</div>
	<!--{loop $taskspacelist $key $value}-->
	<li class="item item-avatar">
		<img src="{php echo tomedia($value['avatar'])}"/>
		<h2>任务：{$value['taskname']}</h2>
		<p>完成时间：<!--{php echo date('Y年m月d日',$value[dateline])}--></p>
	</li>
	<!--{/loop}-->
	
	<div style="height:55px;display:block;"></div>
</div>

{/if}
<div style="height:55px;display:block;"></div>
</ion-content>

<script>
angular.module('ionicApp', ['ionic'])

.controller('MyCtrl', function($scope, $http) {
	$scope.title = '{php echo $title}';
	$scope.items = {php echo json_encode($items)};
});
</script>

<div class="tabs tabs-stable tabs-icon-top">
	<a class="tab-item " href="{php echo $this->createMobileUrl('task')}">
		<i class="icon ion-ios-person-outline "></i>
		<span -bg></span>
			待参与任务
	</a>
	<a class="tab-item "  href="{php echo $this->createMobileUrl('task',array('view'=>'done'))}">
		<i class="icon ion-ios-paper"></i>
			已参与任务
	</a>
	{if $task}
	<a class="tab-item assertive"  href="{php echo $this->createMobileUrl('task',array('taskid'=>$task['taskid']))}">
		<i class="icon ion-ios-navigate-outline"></i>
			查看任务
	</a>
	{/if}
</div>
{template 'default/templates/common/footer-base'}
